const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const miniCssExtractPlugin = require('mini-css-extract-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
//entry 入口文件 单文件和多文件
//output打包文件地址
//loader让webpack能够去处理那些非js文件的模块
//如果是外部资源，是不需要考虑webpack的，只有本地的图片才需要被webpack处理
module.exports = {
  // mode: 'development',
  // entry: './src/index.js',
  /*  entry: {
     main: './src/main.js',
     search: './src/search.js'
   }, */
  entry: './src/css.js',
  /* output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  }, */
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: '[name].js'
  },
  module: {
    rules: [
      /* {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      } */
      {
        test: /\.css$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
            options: {
              publicPath: '../'
            }
          },
          'css-loader']
      },
      {
        test: /\.(jpg|png|gif)$/,
        use: {
          loader:'url-loader',
          options:{
            name:'img/[name].[ext]',
            esModule:false,
            limit:3000
          }
        }
      },
      {
        test:/\.(htm|html)/,
        loader:'html-withimg-loader'
      },
      {
        test: /\.(jpg|png|gif)$/,
        use: {
          loader:'file-loader',
          options:{
            name:'img/[name].[ext]',
            esModule:false
          }
        }
      },
    ]
  },
  plugins: [
    //单入口
    /*  new HtmlWebpackPlugin({
       template:"./index.html"
     }) */
    //多入口
    /* new HtmlWebpackPlugin({
      template: "./main.html",
      filename: 'mian.html',
      chunks: ['main'],
      minify: {
        //删除index.html中的注释
        removeComments: true,
        //删除index.html中的空格
        collapseWhitespace: true,
        //删除各种html标签属性的双引号
        removeAttributeQuotes: true
      }
    }),
    new HtmlWebpackPlugin({
      template: "./search.html",
      filename: 'search.html',
      chunks: ['search']
    }) */
    new HtmlWebpackPlugin({
      template: "./src/img.html",
      filename: 'img.html'
    }),
    new MiniCssExtractPlugin({
      filename: 'css/[name].css'
    })

  ]

}